import Vue from 'vue'
import VueRouter from 'vue-router'
const Hunt = () => import('@/components/hunt.vue')
const Play = () => import('@/components/play.vue')
const Footer = () => import('@/components/footer.vue')
Vue.use(VueRouter)
const routes = [
  {
    path: '/',
    name: 'interim',
    component: () => import('@/views/interim')
  },
  {
    // 首页
    path: '/Music',
    name: 'Music',
    components: {
      default: () => import('@/views/Music'),
      footer: Footer,
      play: Play
    }
  },
  {
    // 首页
    path: '/mv',
    name: 'mv',
    components: {
      default: () => import('@/views/Music/mv'),
      footer: Footer
    }
  },
  // 电台
  {
    path: '/Sine',
    name: 'Sine',
    components: {
      default: () => import('@/views/Music/Sine')
    }
  },
  // 明星
  {
    path: '/star',
    name: 'star',
    components: {
      default: () => import('@/views/Music/star'),
      footer: Footer,
      hunt: Hunt,
      play: Play
    }
  },
  // 动态分类
  {
    path: '/recommend',
    name: 'recommend',
    // 注册组件
    components: {
      // 导出组件
      default: () => import('@/views/recommend/index.vue'),
      footer: Footer,
      hunt: Hunt,
      play: Play
    }
  },
  // 登录
  {
    path: '/login',
    name: 'login',
    components: {
      default: () => import('@/views/login')
    }
  },
  // 注册
  {
    path: '/register',
    name: 'register',
    components: {
      default: () => import('@/views/register')
    }
  },
  // 搜索
  {
    path: '/search',
    name: 'search',
    components: {
      default: () => import('@/views/search')
    }
  },
  {
    path: '/seek/:keywords',
    name: 'seek',
    components: {
      default: () => import('@/views/search/seek')
    }
  },
  {
    path: '/detail/:id',
    name: 'detail',
    components: {
      default: () => import('@/views/recommend/detail'),
      footer: Footer,
      play: Play
    }
  },
  {
    // 推荐
    path: '/discover',
    name: 'discover',
    // 注册组件
    components: {
      default: () => import('@/views/discover/index.vue'),
      footer: Footer,
      play: Play,
      hunt: Hunt
    }
    // component: () => import('@/views/discover/index.vue')
  },
  {
    // 推荐详情
    path: 'deltes/:id',
    name: 'deltes',
    // 注册组件
    components: {
      default: () => import('@/views/discover/delte.vue'),
      footer: Footer,
      play: Play
    }
    // component: () => import('@/views/discover/index.vue')
  },
  {
    path: '/user',
    name: 'user',
    components: {
      default: () => import('@/views/user/index.vue'),
      footer: Footer,
      play: Play,
      hunt: Hunt
    }
  },
  // 立即体验
  {
    path: '/interim',
    name: 'interim',
    component: () => import('@/views/interim')
  },
  // 过度动画
  {
    path: '/guard',
    name: 'guard',
    component: () => import('@/views/guard')
  }
]
const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})
router.beforeEach((to, from, next) => {
  // to 现在所在的
  // form 上次的地址
  if (to.name === 'interim') {
    if (localStorage.getItem('isFirst')) {
      console.log(1)
      next('/guard')
    } else {
      next()
    }
  } else {
    next()
  }
  if (to.name === 'user') {
    if (localStorage.getItem('loginState') === 'ok') {
      next()
    } else {
      next('/login')
    }
  }
})
export default router
